<!--
 * @Author: xiaxia
 * @Description: 
 * @Date: 2024-05-09 10:15:01
 * @LastEditTime: 2024-05-29 16:18:03
 * @FilePath: \vue-admin-template\src\views\table\table\index.vue
-->
<template>
  <div class="app-container">
    <el-table
      :data="tableData"
      style="width: 100%;margin-bottom: 20px;"
      row-key="id"
    >
      <el-table-column type="index" width="50" />
      <el-table-column prop="codeInvoice" label="发票代码" width="120" />
      <el-table-column prop="numInvoice" label="发票号码" width="180" />
      <el-table-column prop="tpyeInvioce" label="发票类型" width="105">
        <template v-slot="{row}">
          <el-tag 
            :type="row.tpyeInvioce | typeFilter(tagType)"
            :effect="row.tpyeInvioce | effectFilter(tagEffect)"
          >
            {{ transType(row.tpyeInvioce) }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="unAmount" label="未税金额" width="110" align="right"/>
      <el-table-column prop="taxAm" label="税额" width="100" align="right"/>
      <el-table-column prop="inAmount" label="含税金额" width="110" align="right"/>
      <el-table-column prop="kpDate" label="开票日期" width="100"/>
      <el-table-column prop="custName" label="购方名称" show-overflow-tooltip>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import {transType} from '@/utils'

export default {
  filters: {
    typeFilter(type, tagType) {
      let typeMap = tagType
      return typeMap[type]
    },
    effectFilter(effect, tagEffect) {
      const effectMap = tagEffect
      return effectMap[effect]
    },
  },
  data() {
    return {
      tableData: this.$store.state.invioceLists, 
      tagType: this.$store.state.tagType,
      tagEffect: this.$store.state.tagEffect,
      tpyeInvioceAll: this.$store.state.tpyeInvioceAll, // 发票类型
    }
  },
  created() {},
  methods: {
    // 转换发票类型
    transType(val) {
      return transType(val)
    },
  }
}
</script>
